import { useMemo } from 'react';
import type { ActionType } from '@ant-design/pro-components';
import { Button, Space } from 'antd';
import type { ButtonProps } from 'antd';

export interface ToolBarButton {
  /** 按钮文本 */
  text: string;
  /** 按钮类型 */
  type?: ButtonProps['type'];
  /** 按钮图标 */
  icon?: React.ReactNode;
  /** 按钮点击事件 */
  onClick: (action: ActionType | undefined) => void;
  /** 按钮权限 */
  access?: string;
}

interface UseToolBarOptions {
  /** 工具栏按钮配置 */
  buttons?: ToolBarButton[];
  /** 表格实例 */
  actionRef?: React.MutableRefObject<ActionType | undefined>;
}

/**
 * 处理表格工具栏的 Hook
 */
const useToolBar = (options: UseToolBarOptions) => {
  const { buttons = [], actionRef } = options;

  const toolBarRender = useMemo(
    () => () => {
      const visibleButtons = buttons;

      return [
        <Space key="toolbar">
          {visibleButtons.map((button, index) => (
            <Button
              key={index}
              type={button.type}
              icon={button.icon}
              onClick={() => button.onClick(actionRef?.current)}
            >
              {button.text}
            </Button>
          ))}
        </Space>,
      ];
    },
    [buttons, actionRef]
  );

  return {
    toolBarRender,
  };
};

export default useToolBar; 